import React, { Fragment, Suspense } from 'react';
import { Redirect, Switch } from 'react-router-dom';
import RouterConfig from './RouterConfig';
import RouterCell from './RouterCell.jsx';
import AppContext from './context';
import fetchRequest from './util/fetchRequest';
import './UIComponent/PickerView.css';
import getRolePath from './util/getRolePath';
import './mock';

export default class Routers extends React.PureComponent {
    constructor() {
        super();
        this.onChangeStatisticData = this.onChangeStatisticData.bind(this);
        this.state = {
            user: {},
            permission: [],
            isLogin: false,
            isLoading: true,
            userList: [],
            orgId: '',
            staticDepartmentName: [],
            menu: [] //该角色可查看的路径
        }
    }
    componentDidMount() {
        this.onLogin()
            .then(result => {
                this.setState({ user: result.data });
                this.getPermission();
            })
    }
    getPermission() {
        fetchRequest('/api/management/config/fetch_permission_list', { data: {}, method: 'POST'}).then(result => {
            const permission = _.get(result, ['data']) || [];
            let menu = [];
            if (_.get(this.state.user, ['permissions'])) {
                menu = getRolePath(permission, this.state.user.permissions);
            }
            this.setState({ permission: _.get(result, ['data']) || [], isLogin: true, menu });
        });
    };
    async onLogin () {
        const user = await fetchRequest('/api/admin_login', { data: { }, method: 'POST'});
        return user;
    }
    onChangeStatisticData({ orgId, departmentName }) {
        this.setState({ orgId, staticDepartmentName: departmentName });
    }
    loadingComponent() {
        return (
            <div className="weui-loadmore">
                <i className="weui-loading" />
                <span className="weui-loadmore__tips">正在加载</span>
            </div>
        )
    }
    render() {
        const { user, permission, userList, orgId, staticDepartmentName, menu } = this.state;
        if (!this.state.isLogin) {
            return (
                <Fragment>
                    {this.loadingComponent()}
                </Fragment>);
        }
        return (
            <AppContext.Provider
                value={{
                    user,
                    permission,
                    userList,
                    statistics: {
                        orgid: orgId,
                        departmentName: staticDepartmentName,
                        onChangeStatisticData: this.onChangeStatisticData
                    }
                }}
            >
                <Suspense fallback={this.loadingComponent()}>
                    <Switch>
                        {RouterConfig.map(it => <RouterCell {...it} key={it.path} />)}
                        <Redirect from='/' to={menu[0].path} />
                    </Switch>
                </Suspense>
            </AppContext.Provider>
        );
    }
}
